
<!--浏览电影主页-->

<template>
  <div class="body">
    <catshit-header active-index="1"></catshit-header>
    <div class="main">
      <el-carousel class="carousel" height="500px" type="card" interval="1000">
        <el-carousel-item>
          <img src="../../assets/images/c.jpg" style="width: 75%;height: 100%">
        </el-carousel-item>
        <el-carousel-item>
          <img src="../../assets/images/a.jpg" style="width: 80%;height: 100%">
        </el-carousel-item>
        <el-carousel-item>
          <img src="../../assets/images/b.jpg" style="width: 80%;height: 100%">
        </el-carousel-item>
      </el-carousel>
      <div class="under">
        <el-card class="box-card">
          <div slot="header">
            <span>今日推荐</span>
            <el-button style="float: right; padding: 3px 0" type="text" @click="chakanquanbu">查看全部</el-button>
          </div>
          <div class="list">
            <film-list :film-list="filmList"></film-list>
<!--            <el-pagination-->
<!--              style="text-align: center"-->
<!--              :page-size="3"-->
<!--              :pager-count="5"-->
<!--              layout="prev, pager, next"-->
<!--              @current-page="page"-->
<!--              :total="filmListSize"-->
<!--              @current-change="handlePageChange">-->
<!--            </el-pagination>-->
          </div>
        </el-card>
<!--        <el-card class="box-card-right">-->
<!--          <div slot="header">-->
<!--            <span>热映排行</span>-->
<!--            <el-button style="float: right; padding: 3px 0" type="text" @click="chakanxiangqing">查看详情</el-button>-->
<!--          </div>-->
<!--          <div class="list">-->
<!--            <simple-list :list="simpleList"></simple-list>-->
<!--          </div>-->
<!--        </el-card>-->
      </div>

    </div>
  </div>
</template>

<script>
  import CatshitHeader from "../../components/CatshitHeader";
  import FilmList from "../../components/FilmList";
  import SimpleList from "../../components/SimpleList";
  export default {
    name: "index",
    components: {SimpleList, FilmList, CatshitHeader},
    data(){
      return{
        filmList:[],
        simpleList:[],
        filmListSize:Number,
        page:1,
      }
    },
    mounted() {
      this.getFilmList();
      // this.getSimpleList();
    },
    methods:{
      getSimpleList(){
        let mydata={
          order_by:'film_box_office desc',
        }
        this.$axios.$post('film/film/list',mydata).then((res)=>{
          if(res.code===0){
            console.log(res);
            this.simpleList=res.data.info;
            console.log(res);
            console.log(this.simpleList);
          }
        })
      },
      chakanquanbu(){
        this.$router.push(({path:'/ViewMovie/ClassView'}));
      },
      chakanxiangqing(){
        this.$router.push(({path:'/ViewMovie/BoxRanking'}));
      },
      // handlePageChange(param){
      //   console.log("current page:" +param);
      //   this.page=param;
      //   this.getFilmList();
      // },
      getFilmList(){
        let mydata={
          queryString:'',
        }
        this.$axios.$post('/search',mydata).then((res)=>{
          if(res.code){
            this.$message.error(res.msg)
            return
          }
          this.filmList=res.msg;
        })
      }
    }
    }
</script>

<style scoped>
  .body{
    display: flex;
    background-color: aliceblue;
    justify-content: center;
  }
  .main{
    margin-top: 60px;
    width: 70%;
    background-color: white;
  }
  .carousel{
    margin:5px;
  }
  .under{
    display: flex;
  }
  .box-card{
    width: 100%;
    margin: 5px;
  }
  .box-card-right{
    width: 22%;
    margin: 5px;
  }
  .list{
    width: 100%;
  }
</style>
